import { Button, DotLoading, Modal, Popup, Space, Toast } from "antd-mobile";
import React, { useEffect, useState } from "react";
import requewt from "@/utils/requewt";
import { API, BASE_PATH } from "@/config";
import callFeedback from "@/components/common/modalFeedback";
import { Router, useRouter } from "next/router"
import { KvBrandComp } from "@/components/common";
import { signIn, useSession } from "next-auth/react";
import { useCookies } from "react-cookie";
import { checkENV2, WECHAT, HC, isValidArr, reloadSession, calcCrow, navigateTo,checkENV } from "@/utils";
import { motion } from "framer-motion";
import classNames from "classnames";
import Image from "next/image";
import { ResultComp } from "@/components/pages/prize";
import useApp from "@/stores/useApp";
import { useToolbar } from "@/components/common/toolbar/useToolbar";
import dayjs from "dayjs";
import { useBurialPoint } from "@/components/hooks";
export default function () {
  const { pageRecord } = useBurialPoint()
  const { query,pathname } = useRouter()
  console.log(query,'query')
  const containerVar = {
    hidden: {opacity: 0},
    visible: {
      opacity: 1,
      transition: {
        delayChildren: 0.05,
        staggerChildren: 0.05,
      }
    },
    exit: {y: 50, opacity: 0},
  };

  const itemVar = {
    hidden: {y: 50, opacity: 0},
    visible: {
      y: 0,
      opacity: 1,
    },
  };

  const carVar = {
    hidden: {x: `-100%`,y:'10%', opacity: 0},
    visible: {
      x: 0,
      opacity: 1,
      transition: {
        delay: .4
      }
    },
    exit: {
      x: `100%`
    }
  };

  const qiVar = {
    hidden: {scale: 0, opacity: 0},
    visible: {
      scale: 1,
      opacity: 1,
      transition: {
        delay: .6,
        duration: 0.3
      }
    },
  };

  const itemVerticalLeftVar = {
    hidden: {x: -50, opacity: 0},
    visible: {x: 0, opacity: 1},
  };

  const itemVerticalRightVar = {
    hidden: {x: 50, opacity: 0},
    visible: {x: 0, opacity: 1},
  };

  const titleVar = {
    hidden: {x: -100, opacity: 0},
    visible: {
      x: 0,
      opacity: 1,
    },
  };

  const floatVar = {
    visible: {
      y: [0, 20, 0, -20, 0],
      rotate: [0, 2, 0, -2, 0],
      transition: {
        ease: `linear`,
        duration: 10,
        repeat: Infinity,
      }
    },
  };

 

  useEffect(() => {
    (async () => {
      Toast.clear();
      // await handler.check();
      // await handler.remain()
      console.log(query,'///////')
    })()

    return () => {
      Toast.clear();
      Modal.clear()
    }
  }, [])
  useEffect(() => {
    
    if (query.source) {
      pageRecord({
        ...query,
        category: pathname
      })
    }
  }, [query])

  return (
    <div className="deco-wrapper">
      <div style={{padding:'1.2rem'}}>
      <img 
        src={`${BASE_PATH}/img/game/logo.png`}
        style={{width:'100%'}}
      />
      </div>
      <div style={{textAlign:'center',color:'#fff',fontSize:'2rem',marginTop:'1rem'}}>
      极狐阿尔法S5<br />寻找超能体验官
      </div>
      <div>
        <div style={{width:'32vw',height:'32vw',background:'#fff',margin:'1rem  auto 0.5rem'}}>
          <img 
          style={{width:'100%'}}
            src={`${BASE_PATH}/img/game/qr-code.jpg`}
          />
        </div>
        <div style={{color:'#fff',textAlign:'center',fontSize:'1rem'}}>
        添加企微报名
        </div>
      </div>
      <div>
        <img 
          style={{width: '80vw',display:'block', margin: '1.4rem auto'}}
          src={`${BASE_PATH}/img/game/tips-bg.png`}
        />
      </div>
      </div>
  )
}